<template>
  <section class="content">
    <Header :title="title">
    	 <div slot="left" @click="goBack" style="width: 100%;height: 100%;text-align: center;">
        <i class="iconfont icon-arrow-left" style="font-size: 22px"></i>
      </div>
    </Header>
    <div class="main">
      <div class="title_box">
        <p class="title">{{info.title}}</p>
        <p class="footer"><b class="read" style="margin-right: 15px;">{{info.viewed}}人阅读</b><b class="date">{{info.updateTime}}</b></p>
      </div>
      <div class="html_box" v-html="info.content">
      </div>
    </div>
  </section>
</template>
<script>
import Header from '../../components/Header/Header.vue'
import {reqNewsDetails} from '../../api/index.js'
export default {
  data() {
    return {
      info: {},
      title: ''
    }
  },
  mounted(){
    this.initData()
  },
  methods:{
    async initData(){
      let query = this.$router.history.current.query;
      let titleId = query.title;
      if(titleId === 1){
        this.title="资讯详情"
      }else{
        this.title="通知详情"
      }
      let result = await reqNewsDetails({id: query.id});
      console.log('result' ,result);
      if(result.code === 1){
        this.info = result.data;
      }else{
        this.$vux.toast.show(`获取详情信息失败:${result.msg}`);
      }
    },
  	goBack() {
  		if (window.history.length <= 1) {
        this.$router.push({ path: "/" });
        return false;
      } else {
        this.$router.go(-1);
      }
    },
  },
  components: {
    Header
  }
}

</script>
<style lang="less" scoped>
@import '../../util/theme.less';

.content {
  .be-full();
	background: @white;

  .main {
    width: 100%;
    height: calc(~"100% - 46px");
    position: relative;
    overflow: hidden;
    .mix-flex-center();
    flex-direction: column;
    box-sizing: border-box;
  }

  .title_box {
    width: 100%;
    padding: 10px 15px;
    border-bottom: 1px solid @border-base;
    box-sizing: border-box;
    flex: 0;
    .title {
      font-size: 16px;
      margin-bottom: 10px;
      text-align: center;
    }

    .footer {
      font-size: 12px;
      color: @font-secondary;
      .mix-flex-center();
    }
  }

  .html_box {
  	width: 100%;
    flex: 1;
    padding: 15px 10px;
    overflow-y: auto;
    overflow-x: hidden;
  }
}

</style>
